<template>
  <div class="app-container">
      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" >
      <el-form-item label="案件编号" prop="ajbh">
        <el-input
          v-model="queryParams.ajbh"
          placeholder="请输入案件编号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="扣押持有人姓名" prop="hsr">
        <el-input
          v-model="queryParams.hsr"
          placeholder="请输入扣押持有人姓名"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
        <el-form-item label="收取起始日期" prop="ksrq">
          <el-date-picker clearable
              v-model="queryParams.ksrq"
              type="date"
              value-format="yyyy-MM-dd"
              placeholder="请选择收取起始日期">
          </el-date-picker>
          </el-form-item>
          <el-form-item label="收取截至日期" prop="jsrq">
          <el-date-picker clearable
              v-model="queryParams.jsrq"
              type="date"
              value-format="yyyy-MM-dd"
              placeholder="请选择收取截至日期">
          </el-date-picker>
          </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    <el-form-item>
      <el-radio-group v-model="queryParams.ky_sqshzt">  
        <el-radio label="0" @change="handleQuery">待审核</el-radio>
        <el-radio label="1" @change="handleQuery">已审核</el-radio>
      </el-radio-group>
    </el-form-item>
    </el-form>

    <el-table v-loading="loading" :data="bzjtableList"  @current-change="tableCurrentChange" @row-dblclick="doubleclick">
      <!-- <el-table-column label="序号" align="center" prop="xh" /> -->
      <el-table-column label="扣押编号" align="center" prop="ky_bh" width="100"/>
      <el-table-column label="案件编号" align="center" prop="ajbh" width="180"/>
      <el-table-column label="案件名称" align="center" prop="ajmc" width="220"/>
      <!-- <el-table-column label="办案单位" align="center" prop="badw" width="100"/> -->
      <el-table-column label="扣押收取金额" align="center" prop="kyje" width="100"/>
      <el-table-column label="扣押持有人" align="center" prop="ky_kykcyr"  width="100"/>
      <el-table-column label="扣押单位名称" align="center" prop="ky_kydw"  width="180"/>
      <el-table-column label="扣押持有人姓名" align="center" prop="hsr" width="100"/>


      <el-table-column label="被取保候审人身份证号" align="center" prop="ky_hsrsfzh" width="100"/>
      <el-table-column label="委托人" align="center" prop="ky_wtr" width="100"/>
      <el-table-column label="委托人身份证号" align="center" prop="ky_wtrsfzh" width="100"/>
      <el-table-column label="扣押开户行" align="center" prop="ky_khh" width="100"/>
      <el-table-column label="扣押银行账号" align="center" prop="ky_yhzh" width="100"/>


      <!-- <el-table-column label="扣押物品类型" align="center" prop="ky_type" width="150">
        <template slot-scope="scope">
        {{ scope.row.ky_type == 1 ? '货币有价证券' : scope.row.ky_type == 2 ? '其他' : '' }}
      </template>
      </el-table-column> -->
      <!-- <el-table-column label="扣押物品名称" align="center" prop="kymc" width="180"/> -->
      <!-- <el-table-column label="扣押物品数量" align="center" prop="kysl" width="100"/> -->
      <el-table-column label="扣押收取方式" align="center" prop="ky_sqfs" width="100"/>
      <el-table-column label="币种" align="center" prop="kydw"  width="100"/>
      <el-table-column label="扣押收取审核状态" align="center" prop="ky_sqshzt" width="100">
        <template slot-scope="scope">
        {{ scope.row.ky_sqshzt == 0 ? '待审核' : scope.row.ky_sqshzt == 1 ? '已审核' : '' }}
      </template>
      </el-table-column>
      <el-table-column label="办案人" align="center" prop="ky_sqczr" width="180"/>
      <el-table-column label="办案人联系方式" align="center" prop="ky_sqczrlxfs" width="100"/>
      <el-table-column label="扣押收取日期" align="center" prop="ky_sqrq" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.ky_sqrq, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
    </el-table>
    
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

<!-- 双击页面 -->

<el-dialog :title="tit" :visible.sync="open" width="80%">
        <el-form ref="form" :inline="true" :model="form" :rules="ruless" label-width="auto" :hide-required-asterisk="true"  class="creation demo-form-inline">
        <el-row :gutter="20">
          <el-col :span="24">

          <el-divider content-position="center">案件信息</el-divider>
          </el-col>
        <el-col :span="8" >
        <el-form-item label="案件编号" prop="ajbh">
          <el-input v-model="form.ajbh" placeholder="请输入案件编号" style="width: 115%" :disabled="true"/>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="案件名称" prop="ajmc">
          <el-input v-model="form.ajmc" placeholder="请输入案件名称" style="width: 115%" :disabled="true"/>
        </el-form-item>
      </el-col>
      <el-col :span="8" >
        <el-form-item label="扣押编号" prop="ky_bh">
          <el-input v-model="form.ky_bh" placeholder="请输入案件编号" style="width: 115%" :disabled="true"/>
        </el-form-item>
      </el-col>
      <el-col :span="8" >
        <el-form-item label="办案单位" prop="badw">
          <el-input v-model="form.badw"  style="width: 115%"  :disabled="true"/>
        </el-form-item>
      </el-col>
      <el-col :span="8" >
        <el-form-item label="办案人" prop="ky_sqczr">
          <el-input v-model="form.ky_sqczr" style="width: 115%" :disabled="true"/>
        </el-form-item>
      </el-col>
      <el-col :span="8" >
        <el-form-item label="办案人联系电话" prop="ky_sqczrlxfs">
          <el-input v-model="form.ky_sqczrlxfs" placeholder="请输入办案人联系电话" style="width: 115%"  :disabled="true"/>
        </el-form-item>
      </el-col>
      <el-col :span="24">
      <el-divider content-position="center">个人信息</el-divider>
      </el-col>
      <el-col :span="8" >
        <el-form-item label="扣押款持有人" prop="ky_kykcyr">
          <el-input  v-model="form.ky_kykcyr"  style="width: 115%" :disabled="true"/>
        </el-form-item>
      </el-col>
      <el-col :span="8" >
        <el-form-item label="扣押款持有人姓名" prop="hsr">
          <el-input  v-model="form.hsr"  style="width: 115%":disabled="true"/>
        </el-form-item>
      </el-col>
      <el-col :span="8" >
        <el-form-item label="扣押单位名称" prop="ky_kydw">
          <el-input  v-model="form.ky_kydw"  style="width: 115%"  :disabled="true"/>
        </el-form-item>
      </el-col>
      <el-col :span="8" >
        <el-form-item label="身份证号" prop="ky_hsrsfzh">
          <el-input v-model="form.ky_hsrsfzh" placeholder="请输入身份证号" style="width: 115%" :disabled="true"/>
        </el-form-item>
      </el-col>
      <el-col :span="8" >
        <el-form-item label="委托交款人" prop="ky_wtr">
          <el-input  v-model="form.ky_wtr" placeholder="请输入委托交款人" style="width: 115%"  :disabled="true"/>
        </el-form-item>
      </el-col>
      <el-col :span="8" >
        <el-form-item label="委托交款人身份证号" prop="ky_wtrsfzh">
          <el-input  v-model="form.ky_wtrsfzh" placeholder="请输入委托交款人身份证号" style="width: 115%" :disabled="true"/>
        </el-form-item>
      </el-col>
      <el-col :span="24">
      <el-divider content-position="center">缴款信息</el-divider>
    </el-col>
      <el-col :span="8" >
        <el-form-item label="保证金金额" prop="kyje" class="form-item" style="font-size: 18px;">
          <el-input v-model="form.kyje" placeholder="请输入保证金金额" style="width: 115%" :disabled="true"/>
        </el-form-item>
      </el-col>
    <el-col :span="8" >
        <el-form-item label="收取方式" prop="ky_sqfs">
          <el-input v-model="form.ky_sqfs" placeholder="请输入缴款人账户名称" style="width: 115%" :disabled="true"/>
        </el-form-item>
      </el-col>
      <!-- <el-col :span="8" >
        <el-form-item label="缴款人账户名称" prop="ky_thzhmc">
          <el-input v-model="form.ky_thzhmc" placeholder="请输入缴款人账户名称" style="width: 115%" :disabled="true"/>
        </el-form-item>
      </el-col> -->
      <el-col :span="8" >
        <el-form-item label="缴款人开户行" prop="ky_khh">
          <el-input v-model="form.ky_khh" placeholder="请输入缴款人开户行"  style="width: 115%":disabled="true"/>
        </el-form-item>
      </el-col>
      <el-col :span="8" >
        <el-form-item label="缴款人账户卡号" prop="ky_yhzh">
          <el-input v-model="form.ky_yhzh" placeholder="请输入缴款人账户卡号"  style="width: 115%":disabled="true"/>
        </el-form-item>
      </el-col>
      <el-col :span="8" >
        <el-form-item label="收取审批时间" prop="ky_sqshsj">
          <el-date-picker clearable v-model="form.ky_sqshsj" type="datetime" value-format="yyyy-MM-dd HH:mm:ss" 
            :disabled="true" placeholder="请选择收取审批时间"   style="width: 100%"></el-date-picker>
        </el-form-item>
      </el-col>
      </el-row>
      </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="success" plain icon="el-icon-success" :disabled="!form.ajmc" @click="handleSuccess" >通过</el-button>
      <el-button type="danger"  plain icon="el-icon-error" :disabled="!form.ajmc" @click="handleBack" >退回</el-button>
      <!-- <el-button type="primary" plain icon="el-icon-upload" :disabled="!form.xh" @click="handleYwbj">业务办结</el-button> -->
      <el-button type="warning" @click="handleckfj(form)">查看附件</el-button>
      <el-button type="primary" @click="handlecklc(form)" >查看流程</el-button>
      <el-button @click="cancel">取 消</el-button>
    </div>
  </el-dialog>




  <el-dialog :visible.sync="pdfs" width="45%">
           <div style="display: flex;align-items: center;justify-content: center;">
            <img :src="this.pdfUrl" alt width="80%" />
           </div>
      </el-dialog>
      <el-dialog title="查看附件" :visible.sync="dialogFormVisible">
        <el-table height="600" border :data="fileList" :header-cell-style="{ backgroundColor: 'rgb(237 237 237)'}">
          <el-table-column label="文件名称" prop="fjmc" />
          <el-table-column label="环节" prop="lb" />
          <el-table-column label="文件类型" prop="wjlx" />
          <el-table-column fixed="right" label="操作" width="200">
            <template slot-scope="scope">
              <el-button type="success" plain size="mini" @click="handlexzfj(scope.row)" :disabled="!scope.row.wjdz" >下载附件</el-button>
              <el-button type="success" plain size="mini" @click="yul(scope.row)" :disabled="!(scope.row.wjdz.split('.')[1] == 'png' || scope.row.wjdz.split('.')[1] == 'jpg' || scope.row.wjdz.split('.')[1] == 'jpeg')" >预览</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-dialog>
      <el-dialog title="查看流程" :visible.sync="dialogFlowerTable"  @closed="dialogFlowerTable=false">
        <el-table height="600" border :data="flowerList" :header-cell-style="{ backgroundColor: 'rgb(237 237 237)'}">
          <el-table-column label="案件类别" prop="lb" hidden/>
          <el-table-column label="审批环节" prop="ajlx" />
          <el-table-column label="审批意见" prop="spyj" width="200"/>
          <el-table-column label="审批人" prop="spr" />
          <el-table-column label="审批人职务" prop="sprzw" width="100"/>
          <el-table-column label="审批单位" prop="spdw" width="200"/>
          <el-table-column label="审批时间" prop="spsj" width="180"/>
        </el-table>
      </el-dialog>


<!-- 审批弹窗 -->
  <el-dialog :title="title" :visible.sync="dialogShenHe">
        <div style="display: flex;align-items: stretch;justify-content: space-evenly;flex-direction: column;height: 220px;">
  
          <div style="display: flex;align-items: center;justify-content: center;">
          <div>审批意见:</div>
          <el-input v-model="spyj" style="width: 85%;" :rows="5" type="textarea"></el-input>
        </div>
        <div style="display: flex;align-items: center;justify-content: center;">
          <div style="margin-left: 11px;">审批人:</div>
          <el-input v-model="spr" style="width: 40%;" :rows="5" type="text"></el-input>
          <div style="margin-left: 11px;">职务:</div>
          <el-select v-model="sprzw" style="width: 40%;" :rows="5" type="text"  clearable  placeholder="请选择职务">
            <el-option
          v-for="item in dict.type.sys_sprzw"
          :key="item.value"
          :label="item.label"
          :value="item.label"/>
            </el-select>    
      </div>  
        </div>
        <div style="display: flex;align-items: center;justify-content: center;" v-if="title === '审核通过'">
          <Upload v-model="form.files" :data="{}" acceptTip="*仅图片、PDF类型文件可在线预览"
            multiple></Upload>        
          </div>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitForm">确 定</el-button>
          <el-button @click="cancel">取 消</el-button>
        </div>
      </el-dialog>



  </div>
</template>

<script>
import { kyList , updKy , getFjList ,downLoadFile,getListByXhDetail,kysh} from "@/api/system/bzjtable";
import selectMultiple from '@/views/collect/addSecurity/selectMultiple'
import Upload from '@/views/seizure/DzpjUpload'
import { tansParams, blobValidate } from "@/utils/ruoyi";
import XLSX from 'xlsx';//引入
  import { saveAs } from 'file-saver'
  import pdf from "vue-pdf"

export default {
  name: "Bzjtable",
  dicts: ['sys_type','sys_sprzw'],
  data() {
    let amount = (rule, value, callback) => {
    if (value) {
      if (!/^(0|[1-9]\d*)(\s|$|\.\d{1,2}\b)/.test(value)) return callback(new Error('请输入非负数、最多含两位小数'))
      if (value <= 0) return callback(new Error('金额应大于0'))
      if (value > 999999999999.99) return callback(new Error('金额不能超过999999999999.99'))
    } else {
      return callback(new Error('请输入金额'))
    }
    callback()
  }
  let isValuePresent = (rule, value, callback) => {  
    if (value) {  
      callback();  
    }  else{
      return callback(new Error('请输入办案人'));  
    }
  }
  let isValuePresent1 = (rule, value, callback) => {  
    if (value) {  
      callback();  
    }  else{
      return callback(new Error('请输入扣押物品名称'));  
    }
  }
  let dialogVisibleFile = (rule, value, callback) => {
    console.log(value?.length, ';');
    if (rule.required) {
      if (value?.length) {
        callback()
      } else {
        return callback(new Error('请选择文件'))
      }
    }
    callback()
  }
    return {
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 【请填写功能名称】表格数据
      bzjtableList: [],
      fileList: [],
      // 弹出层标题
      title: "",
      // 日期范围
      dateRange: [],
      clickedRowData : null,
      // 是否显示弹出层
      open: false,
      dialogOpen: false,
      dialogShenHe:false,
      dialogFormVisible: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        ky_sqshzt : '0',
        ajbh: null,
        hsr: null,
        ksrq: '',
        jsrq:''
      },
      // 表单参数
      form: {
        xh:null,
          ky_bh:null,
          ajmc:null,
          ajbh:null,
          badw:null,
          ky_kykcyr:null,
          ky_kydw:null,
          hsr:null,
          ky_khh:null,
          ky_yhzh:null,
          kyje:null,
          kydw:null,
          ky_sqfs:null,
          ky_sqzt:null,
          ky_sqshzt:null,
          ky_sqshsj:null,
          ky_sqczr:null,
          ky_sqczrlxfs:null,
          ky_sqrq:null,
          ky_thfs:null,
          ky_thje:null,
          ky_thkhh:null,
          ky_thzhmc:null,
          ky_thzh:null,
          ky_thzt:null,
          ky_thshzt:null,
          ky_thczr:null,
          ky_thrq:null,
          ky_hbje:null,
          ky_hbkhh:null,
          ky_hbyhzh:null,
          ky_hbzt:null,
          ky_hbshzt:null,
          ky_hbczr:null,
          ky_hbrq:null,
          ky_msje:null,
          ky_mszt:null,
          ky_msczr:null,
          ky_msczrlxfs:null,
          ky_msrq:null,
          ky_wtr:null,
          ky_wtrsfzh:null,
          ky_hsrsfzh:null,
          ky_zxbm:null,
          ky_zxzh:null,
          ky_msshzt:null, 
      },
      flowerList:[],
        dialogFlowerTable:false,
        spyj:'',
        spr:'',
        sprzw:'',
        pdfUrl: '',
        // formInfo: {},
        wjdz: '',
      currentIndex: '',
    // 表单校验
    ruless: {
      ky_mc: [{ required: true, validator: isValuePresent1, trigger: 'change' }],
      ky_sqczr: [{ required: true, validator: isValuePresent, trigger: 'change' }],
      kykje: [{ required: true, validator: amount, trigger: 'change' }],
      ky_msje: [{ required: true, validator: amount, trigger: 'change' }],
      ky_thje: [{ required: true, validator: amount, trigger: 'change' }],
      ky_hbje: [{ required: true, validator: amount, trigger: 'change' }],
      files: [{ required: true, validator: dialogVisibleFile, trigger: 'change' }]
    },
      option: [{
          ky_mszt: '1',
        label: '已没收'
      }, {
          ky_mszt: '0',
        label: '未没收'
      }],
      ky_mszt: '',
      options: [{
          ky_hbzt: '1',
        label: '已划拨'
      }, {
          ky_hbzt: '0',
        label: '未划拨'
      }],
      ky_hbzt: '',
      optionss: [{
          ky_thzt: '1',
        label: '已退还'
      }, {
          ky_thzt: '0',
        label: '未退还'
      }],
      ky_thzt: ''
    };
  },
  components: {
  selectMultiple,
  Upload
},
  created() {
    this.getList();
  },
  methods: {
    handleChange(value) {
      console.log(value);
    },
    /** 查询【请填写功能名称】列表 */
    getList() {
      this.loading = true;
      kyList(this.queryParams).then(response => {
        this.bzjtableList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    // 取消按钮
    cancel() {
      this.dialogShenHe =false;
      this.open = false;
      this.getList();
      this.reset();
    },
    gb() {
    this.getList();
  },
    // 表单重置
    reset() {
      this.form = {
        xh:null,
          ky_bh:null,
          ajmc:null,
          ajbh:null,
          badw:null,
          ky_kykcyr:null,
          ky_kydw:null,
          hsr:null,
          ky_khh:null,
          ky_yhzh:null,
          kyje:null,
          kydw:null,
          ky_sqfs:null,
          ky_sqzt:null,
          ky_sqshzt:null,
          ky_sqshsj:null,
          ky_sqczr:null,
          ky_sqczrlxfs:null,
          ky_sqrq:null,
          ky_thfs:null,
          ky_thje:null,
          ky_thkhh:null,
          ky_thzhmc:null,
          ky_thzh:null,
          ky_thzt:null,
          ky_thshzt:null,
          ky_thczr:null,
          ky_thrq:null,
          ky_hbje:null,
          ky_hbkhh:null,
          ky_hbyhzh:null,
          ky_hbzt:null,
          ky_hbshzt:null,
          ky_hbczr:null,
          ky_hbrq:null,
          ky_msje:null,
          ky_mszt:null,
          ky_msczr:null,
          ky_msczrlxfs:null,
          ky_msrq:null,
          ky_wtr:null,
          ky_wtrsfzh:null,
          ky_hsrsfzh:null,
          ky_zxbm:null,
          ky_zxzh:null,
          ky_msshzt:null, 
      };
      this.resetForm("forms");
    },
    tableCurrentChange(row) {
    // this.form = row
    // this.currentIndex = row?.pIndex
  },
  handleSuccess() {
    this.title = '审核通过'
        this.dialogShenHe = true
      },
      /**双击操作 */
      doubleclick(row){
    this.form = row;
    this.open = true;
  },
  /**修改 */
  updList(row){
    this.$refs.form.validate(valid => {
      if (valid) {
        if (this.form.xh != null) {
    updKy(row).then(response => {
          this.$modal.msgSuccess("修改成功");
          this.open =false;
          this.title = "修改";
          this.reset();
        });
        
      }
      } else {
              // 表单验证失败，给出提示信息  
              this.$message.error('收款失败，请填写必要信息或上传附件！');  
              return false;  
          }
    });
  },
  submitForm() { 
        if(!this.spyj){
          return this.$message.error('请输入审核意见')
        }
        if(!this.spr){
          return this.$message.error('请输入审核人')
        }
        if(!this.sprzw){
          return this.$message.error('请选择审批人职务')
        }
        this.form.files.forEach((item)=>{
          item.wjlx = item.fileType
          console.log(item.fileType)
        })

        this.form.spyj = this.spyj
        this.form.spr = this.spr
        this.form.sprzw = this.sprzw
        this.form.ky_sqshzt = this.title == "审核通过"?1:3
        this.form.ky_sqzt = this.title == "审核通过"?1:0
        kysh(this.form).then(() => {
          this.$modal.msgSuccess(this.title == "审核通过"?"审核通过":'审核退回')
          this.getList()
        // })
            this.dialogShenHe = false
            this.open=false
            this.getList()
          })
      },
      handleBack() {
        this.title = '审核退回'
        this.dialogShenHe = true
      },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    // // 多选框选中数据
    // handleSelectionChange(selection) {
    //   if (selection.length > 0) {  
    //     // 假设我们只关心第一行数据  
    //     const selectedRow = selection[0];  
          
    //     // 填充 form 对象中对应的字段  
    //     this.form.ky_bh = selectedRow.ky_bh;  
    //     this.form.ajbh = selectedRow.ajbh;  
    //     this.form.ajmc = selectedRow.ajmc;  
    //     this.form.hsr = selectedRow.hsr;  
    //     this.form.ky_type = selectedRow.ky_type; 
    //     this.form.ky_mc = selectedRow.ky_mc;  
    //     this.form.ky_sl = selectedRow.ky_sl;  
    //     this.form.kykje = selectedRow.kykje;  
    //     this.form.ky_msje = selectedRow.ky_msje;  
    //     this.form.ky_thje = selectedRow.ky_thje;  
    //     this.form.ky_hbje = selectedRow.ky_hbje;  
    //     this.form.ky_sqrq = selectedRow.ky_sqrq;  
    //     this.form.ky_sqczr = selectedRow.ky_sqczr;  
    //     // 打开对话框  
    //     // this.open = true;  
    //     debugger
    //     this.ids = selection.map(item => item.ky_bh)
    //     this.single = selection.length !== 1
    //     this.multiple = !selection.length
    //   } else {  
    //     // 如果没有选中任何行清空form对象
    //     this.reset(); // 假设你有一个方法来重置 form 对象  
    //   }  
    // },
      handleckfj(row) {
        this.dialogFormVisible = true
        getFjList({ xh: row.ky_bh }).then((res) => {
          this.fileList = res.rows
          // this.fileList.forEach((item) => {
          //   item.typeName = this.dict.type.sys_type.filter((e)=>item.wjlx==e.value)[0].label
          // })
        })
  
      },
      handlecklc(row) {
        this.dialogFlowerTable = true
        getListByXhDetail(row.ky_bh,7).then((res) => {
          this.flowerList = res.rows
        })
      },
      handlexzfj(val) {
        // this.download('/confiscate/forfeitureOfDeposit/downLoadFile', { wjdz: this.form.wjdz }, `role_${new Date().getTime()}.png`)
        downLoadFile({ wjdz: val.wjdz }).then(async (data) => {
          this.$modal.msgSuccess("下载成功");
          const url = window.URL.createObjectURL(data);
          this.pdfUrl = url;//直接用iframe标签
          const isBlob = blobValidate(data);
          if (val.wjdz && val.wjdz.split('.')[1] == 'png' || val.wjdz &&val.wjdz.split('.')[1] == 'jpg' || val.wjdz &&val.wjdz.split('.')[1] == 'jpeg') {
            if (isBlob) {
              const blob = new Blob([data])
              saveAs(blob, `role_${new Date().getTime()}.png`)
            } else {
              const resText = await data.text();
              const rspObj = JSON.parse(resText);
              const errMsg = errorCode[rspObj.code] || rspObj.msg || errorCode['default']
              Message.error(errMsg);
            }
          } else if (val.wjdz &&val.wjdz.split('.')[1] == 'pdf') {
            // let pdfUrl = window.URL.createObjectURL(new Blob([data], { type: "application/pdf" }));
            // window.open(pdfUrl)
            let blob = new Blob([data], { type: 'application/pdf' });
            let downloadElement = document.createElement("a");
            let href = window.URL.createObjectURL(blob); //创建下载的链接
            downloadElement.href = href;
            downloadElement.download = `pdf下载`    //下载后的文件名，根据需求定义
            document.body.appendChild(downloadElement);
            downloadElement.click(); //点击下载
            document.body.removeChild(downloadElement); //下载完成移除元素
            window.URL.revokeObjectURL(href); //释放掉blob对象
          } else {
            const blob = new Blob([data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' }) // response就是接口返回的文件流
            const objectUrl = URL.createObjectURL(blob)
            const a = document.createElement('a') // 创建a标签
            a.href = objectUrl
            a.download = 'excel下载' // 自定义文件名
            a.click() // 下载文件
            window.URL.revokeObjectURL(objectUrl) // 释放内存
            // link.remove()
          }
          this.dialogFormVisible = false
        })
      },
      yul(val) {
        downLoadFile({ wjdz: val.wjdz }).then(async (data) => {
          // if (this.wjdz && this.wjdz.split('.')[1] == 'png' || this.wjdz &&this.wjdz.split('.')[1] == 'jpg' || this.wjdz.split('.')[1] == 'jpeg') {
            const url = window.URL.createObjectURL(data);
            this.pdfUrl = url;//直接用iframe标签
            this.pdfs = true
          // }
        })
      },
    /** 重置按钮操作 */
    resetQuery() {
      this.dateRange = [];
      this.queryParams.ajbh = ''
      this.queryParams.hsr = ''
      this.queryParams.ksrq = ''
      this.queryParams.jsrq = ''
      this.queryParams.ky_sqshzt = '0'

      this.resetForm("queryForm");
      this.handleQuery();
      this.getList;
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download('system/bzjtable/export', {
        ...this.queryParams
      }, `bzjtable_${new Date().getTime()}.xlsx`)
    }
  }
};
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.creation {
  .el-form-item {
    margin-bottom: 15px;
  }

  ::v-deep.el-input__inner {
    width: 250px;
  }

  // .xx {
  //   ::v-deep.el-input__inner {
  //     width: 630px;
  //   }
  // }
}

::v-deep .el-table__body-wrapper::-webkit-srollbar-track {
  background-color: rgba(255, 255, 255, 0);
}

//可设置胶囊宽高
::v-deep .el-table__body-wrapper::-webkit-scrollbar {
  height: 12px;
  width: 10px;
  opacity: 0.5;
}

// 设置胶囊色
::v-deep .el-table__body-wrapper::-webkit-scrollbar-thumb {
  border-radius: 15px;
  background-color: #cdd9e6;
}

::v-deep .el-table__body .el-table__row.hover-bg td {
  background-color: #cde6f7 !important;
}
</style>
